<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://xmlns.jcp.org/jsf/html"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">

    <ui:composition template="/WEB-INF/content/layout.xhtml">
    <c:if test="${empty sessionScope.USER}">
        <ui:define name="left" />
        <ui:define name="right" />
    </c:if>
        <ui:define name="content">

<c:choose>
<c:when test="${empty sessionScope.USER}">
<h3>${msg['login.message']}</h3>
<a href="http://en.wikipedia.org/wiki/OpenID">${msg['login.openid']}</a>
<div data-role="controlgroup" data-type="horizontal">
    <a data-role="button" data-ajax="false" href="${bean.openIds['Google']}">${msg['login.openid.Google']}</a>
    <a data-role="button" data-ajax="false" href="${bean.openIds['Yahoo']}">${msg['login.openid.Yahoo']}</a>
    <a data-role="button" data-ajax="false" href="${bean.openIds['MySpace']}">${msg['login.openid.MySpace']}</a>
    <a data-role="button" data-ajax="false" href="${bean.openIds['AOL']}">${msg['login.openid.AOL']}</a>
    <a data-role="button" data-ajax="false" href="${bean.openIds['MyOpenId']}">${msg['login.openid.MyOpenId']}</a>
</div>
</c:when>
<c:otherwise>
<table>
<tr><th>${msg['login.id']}</th><td>${sessionScope.USER.key.name}</td></tr>
<tr><th>${msg['login.name']}</th><td>${sessionScope.USER.properties['name']}</td></tr>
<tr><th>${msg['login.email']}</th><td>${sessionScope.USER.properties['email']}</td></tr>
<tr><th>${msg['login.domain']}</th><td>${sessionScope.USER.properties['domain']}</td></tr>
<c:if test="${not empty sessionScope.USER.properties['federatedId']}">
<tr><th>${msg['login.federatedId']}</th><td>${sessionScope.USER.properties['federatedId']}</td></tr>
</c:if>
<tr>
    <th>${msg['login.firstLogin']}</th>
    <td>
        <h:outputText value="${sessionScope.USER.properties['firstLogin']}" styleClass="fromNow">
            <f:convertDateTime type="both" timeZone="${sessionScope.TIMEZONE}" />
        </h:outputText>
    </td>
</tr>
<tr>
    <th>${msg['login.lastLogin']}</th>
    <td>
        <h:outputText value="${sessionScope.USER.properties['lastLogin']}" styleClass="fromNow">
            <f:convertDateTime type="both" timeZone="${sessionScope.TIMEZONE}" />
        </h:outputText>
    </td>
</tr>
<tr><th>${msg['login.loginCount']}</th><td>${sessionScope.USER.properties['loginCount']}</td></tr>
<c:if test="${not empty sessionScope.USER.properties['picture']}">
<tr><th>${msg['login.picture']}</th><td><a href="#popupPhoto" data-rel="popup" data-position-to="window" data-transition="fade">${msg['login.picture']}</a></td></tr>
</c:if>
</table>
<a data-role="button" data-ajax="false" data-inline="true" href="LoginServlet?logout=true">${msg['login.logout']}</a>

<c:if test="${not empty sessionScope.USER.properties['picture']}">
<div id="popupPhoto" data-role="popup" data-overlay-theme="b" data-theme="b">
    <a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
    <img src="${sessionScope.USER.properties['picture']}" />
</div>
</c:if>

</c:otherwise>
</c:choose>

<h:form>
<h:outputLabel id="label" for="locale" value="${msg['login.locale.change']}" />
<h:selectOneMenu id ="locale" value="#{bean.locale}" onchange="submit()">
    <f:passThroughAttribute name="data-inline" value="true" />
    <f:selectItem itemLabel="${msg['login.locale.default']}" itemValue="" />
	<f:selectItems value="#{bean.supportedLocales}" var="l" itemValue="#{l}" itemLabel="#{l.displayName}" />
</h:selectOneMenu>
<h:messages />
</h:form>

        </ui:define>
    </ui:composition>

</html>